{extend name="base/common"}

{block name="style"}
<link rel="stylesheet" href="__STATIC__/datepicker/bootstrap-datetimepicker.min.css">
<link href="__ADMIN__/css/plugins/ladda/ladda-themeless.min.css" rel="stylesheet">
<style>
    .showbox {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        /*padding: 5%;*/
        background: rgba(0, 0, 0, 0.3);
        display: none;
        width: 100%;
        height: 100%;
    }

    .loader {
        position: relative;
        margin: 0 auto;
        width: 100px;
        margin-top: 70%;
    }
    .loader:before {
        content: '';
        display: block;
        padding-top: 50%;
    }

    .circular {
        animation: rotate 2s linear infinite;
        height: 100%;
        transform-origin: center center;
        width: 100%;
        position: absolute;
        top: -98vw;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }
    .path {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
        animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
        stroke-linecap: round;
    }

    @keyframes rotate {
        100% {
            transform: rotate(360deg);
        }
    }
    @keyframes dash {
        0% {
            stroke-dasharray: 1, 200;
            stroke-dashoffset: 0;
        }
        50% {
            stroke-dasharray: 89, 200;
            stroke-dashoffset: -35px;
        }
        100% {
            stroke-dasharray: 89, 200;
            stroke-dashoffset: -124px;
        }
    }
    @keyframes color {
        100%,
        0% {
            stroke: #d62d20;
        }
        40% {
            stroke: #0057e7;
        }
        66% {
            stroke: #008744;
        }
        80%,
        90% {
            stroke: #ffa700;
        }
    }
    .breadcrumb>li+li:before {
        display: none;
    }
</style>
{/block}

{block name="page-header"}
<div class="row wrapper border-bottom white-bg page-heading">
    <div class="col-lg-6">
        <h2>课表管理</h2>
        <ol class="breadcrumb">
            <li>
                课表 /
            </li>
            <li class="active">
                <strong><a href="{:Url('Course/index')}">列表页</a></strong>
            </li>
        </ol>
    </div>
    <div class="col-lg-5">
        <ol class="breadcrumb">
            <h2>数据导出</h2>
            <li>
                <input type="text" placeholder="开始时间" autocomplete="off" class="input-sm form-control datetimepicker" name="start"  value=""/>
            </li>
            <li>
                <input type="text" placeholder="结束时间" autocomplete="off" class="input-sm form-control datetimepicker" name="end"  value=""/>
            </li>
            <li>
                <button type="submit"  class="btn btn-sm btn-primary post-add">导出表格</button>
            </li>
        </ol>
    </div>
</div>
{/block}

{block name="main"}
<div id="qrcode" style="display: none"></div>
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <form method="get" action="">
                        <div class="col-sm-3" style="width: 70%">
                            <div class="input-group" style="float: left;margin-right: 10px">
                                <input type="text" placeholder="根据分校筛选" class="input-sm form-control" name="place" value="{notempty name='Think.get.place'}{$Think.get.place}{/notempty}">
                            </div>

                            <div class="input-group" style="float: left;margin-right: 10px">
                                <input type="text" placeholder="根据项目筛选" class="input-sm form-control" name="name" value="{notempty name='Think.get.name'}{$Think.get.name}{/notempty}">
                            </div>

                            <div class="input-group" style="float: left;margin-right: 10px">
                                <input type="text" placeholder="根据班型筛选" class="input-sm form-control" name="class" value="{notempty name='Think.get.class'}{$Think.get.class}{/notempty}">
                            </div>

                            <div class="input-group" >
                                <input type="text" placeholder="根据时间筛选" autocomplete="off" class="input-sm form-control datetimepicker" name="time"  value="{notempty name='Think.get.time'}{$Think.get.time}{/notempty}"/>
                            <span class="input-group-btn">
                                <button type="submit" class="btn btn-sm btn-primary">查询</button>
                            </span>
                            </div>
                        </div></form>
                    <div class="ibox-tools">
                        <div class="ladda-button ladda-button-user btn btn-sm
                        btn-primary" >
                            <input type="file" name="excel" id="excel" style="width:100%;height:100%;position: absolute; opacity: 0"/>
                            Excel导入
                        </div>
                        <a data-toggle="modal" class="btn btn-sm btn-primary" href="{:Url('Course/edit')}">添加</a>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th>项目</th>
                                <th>分校</th>
                                <th>班型</th>
                                <th>科目</th>
                                <th>授课老师</th>
                                <th>上课日期</th>
                                <th>操作&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&nbsp;<a href="http://www.popedu.net/test_paper/list.php" target="_blank">试卷列表</a></th>
                            </tr>
                            </thead>
                            <tbody>
                            {volist name="list" id="vo"}
                            <tr>
                                <td width="10%" style="vertical-align: middle">{$vo.project_name}</td>
                                <td width="10%" style="vertical-align: middle">{$vo.place}</td>
                                <td class="name" width="17%" style="vertical-align: middle">{$vo.class|get_banxing}</td>
                                <td width="22%" style="vertical-align: middle">{$vo.subject}</td>
                                <td width="8%" style="vertical-align: middle">{$vo.teacher}</td>
                                <td width="10%" style="vertical-align: middle">{$vo.start_time|time_format='Y-m-d'}</td>
                                <td width="23%" style="vertical-align: middle">
                                    <a href="{:Url('Course/scan?id='.$vo['id'])}">查看</a>&nbsp;|&nbsp;<a href="{:Url('Course/del?id='.$vo['id'])}" class="confirm ajax-del">删除</a>&nbsp;|&nbsp;<a onclick="download1('{$vo.id}')">二维码</a>&nbsp;|&nbsp;<a href="{:Url('Course/student?id='.$vo['id'])}">分配学员</a>&nbsp;|&nbsp;<a href="http://www.popedu.net/test_paper/add.php?c_id={$vo['id']}">试卷录入</a>
                                </td>
                            </tr>
                            {/volist}
                            </tbody>
                            <tfoot>
                            <tr>
                                <td colspan="10">
                                    <div class="page">{$_page}</div>
                                </td>
                            </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<iframe id="iframe" src="" style="height: 80%;width: 392px;z-index: 99;position: absolute;top: 10%;border: 0;left: 32%;background: #fff;display: none;" scrolling="auto" seamless></iframe>
<div class="showbox">
    <div class="loader">
        <svg class="circular" viewBox="25 25 50 50">
            <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/>
        </svg>
    </div>
</div>
{/block}

{block name="script"}
<script src="__ADMIN__/js/plugins/iCheck/icheck.min.js"></script>
<script src="__ADMIN__/js/jquery.qrcode1.min.js"></script>
<script src="__STATIC__/datepicker/bootstrap-datetimepicker.js"></script>
<script src="__ADMIN__/js/plugins/ladda/spin.min.js"></script>
<script src="__ADMIN__/js/plugins/ladda/ladda.min.js"></script>
<script src="__ADMIN__/js/plugins/ladda/ladda.jquery.min.js"></script>
<script>
    $(document).ready(function(){
        $('.i-checks').iCheck({
            checkboxClass: 'icheckbox_square-green',
            radioClass: 'iradio_square-green',
        });
    });
    //    时间日历
    $( ".datetimepicker" ).datetimepicker( {
        language:  'cn',
        format: 'yyyy-mm-dd',
        minView: "month",
        forceParse: false,
        todayBtn: true,
        autoclose: true,
        todayHighlight: 1,
        minuteStep: 5

    });
    var name=$('.name').text();
    //下载二维码函数
    function download1(id){
        $('#qrcode').html('');
        var WW = $(window).width();
        var WH = $(window).height();
        jQuery('#qrcode').qrcode({
            width:WW * 0.9 - 50,
            height: WW * 0.9 -50 ,
            text:id,
            imgWidth : (WW * 0.9 -50) * 0.25 ,            //图片宽
            imgHeight :(WW * 0.9 -50) * 0.25 ,
            src: '__ADMIN__/images/qrcode.jpeg'
        });
        updateAlert('二维码生成中...','success');
        //logo图片加载有时候不完全,增加个定时器
        setTimeout(function(){
            swal({
                title: "二维码生成成功",
                text: "<div id='down'></div>",
                html: true,
                confirmButtonText:'取消',
                type: "success"
            });
            downloadFile(id+"-"+name+".jpg",$('#qrcode').find("canvas")[0].toDataURL("image/jpeg",1));
        },1000);
    }
    //下载事件函数
    function base64Img2Blob(code){
        var parts = code.split(';base64,');
        var contentType = parts[0].split(':')[1];
        var raw = window.atob(parts[1]);
        var rawLength = raw.length;
        var uInt8Array = new Uint8Array(rawLength);
        for (var i = 0; i < rawLength; ++i) {
            uInt8Array[i] = raw.charCodeAt(i);
        }
        return new Blob([uInt8Array], {type: contentType});
    }
    function downloadFile(fileName, content){
        var aLink = document.createElement('a');
        var blob = base64Img2Blob(content); //new Blob([content]);
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent("click", false, false);//initEvent 不加后两个参数在FF下会报错
        aLink.download = fileName;
        aLink.href = URL.createObjectURL(blob);
        $(aLink).html('点击下载');
        //点击下载后,弹出框消失
        $(aLink).click(function(){swal.close()});
        $('#down').append(aLink);
    }
    $('#excel').change(function(){
        var l = $( '.ladda-button-user' ).ladda();
        l.ladda( 'start' );
        var formData = new FormData();
        formData.append('excel', $(this)[0].files[0]);
        $.ajax({
            type: "post",
            url: "{:Url('Course/inserExcel')}",
            data:formData,
            processData : false,
            contentType : false,
            beforeSend:function () {
                $(".showbox").show();
            },
            success: function (data) {
                $(".showbox").hide();
                if(data.code == 1){
                    updateAlert(data.msg, 'success');
                }else{
                    updateAlert(data.msg, 'error');
                }
                setTimeout(function(){
                    location.reload();
                },2000);
            },error:function (res) {
                updateAlert('导入失败请重试!', 'error');
            }
        });
    });
    $('.post-add').click(function(){
        var start = $("input[name='start']").val();
        var end = $("input[name='end']").val();
        if(start == '' || end == ''){
            updateAlert('缺少时间参数！' ,'error');
            return false;
        }
        if (start > end){
            updateAlert('结束时间错误！' ,'error');
            return false;
        }
        window.location.href="http://mp.csppat.com/DDDeducation/public/index.php/admin/course/outpapers/start/"+start+"/end/"+end;
    })
</script>
{/block}